import React from 'react';
import { Tabs, List, Icon } from 'antd';
import { formatMessage, connect } from 'umi';
import { get as getPath } from 'object-path';
import LinkTo from '@/components/LinkTo';
import authHelper from '@/utils/auth/helper';
import AuthCode from '@/utils/auth/AuthCode';
import style from '../Gateway.less';

const { checkCode } = authHelper;

class WorkList extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            goMore: 1
        };
        this.authCode = new AuthCode(props.route.code).authCode;
    }

    // 切换面板
    activeTab = activekey => {
        if (activekey === 'approve') {
            this.setState({
                goMore: 1
            });
        } else if (activekey === 'read') {
            this.setState({
                goMore: 3
            });
        } else {
            this.setState({
                goMore: 2
            });
        }
    };

    render() {
        const { TabPane } = Tabs;
        const {
            gateway: { approveData, readData, passData, passDataCount, readDataCount, approveCount }
        } = this.props;
        return (
            <div className={style.bgfff} style={{ minHeight: '286px' }}>
                <Tabs defaultActiveKey="approve" onChange={this.activeTab}>
                    {checkCode(this.authCode('undo')) && (
                        <TabPane
                            tab={`${formatMessage({
                                id: 'list.approve.title'
                            })} (${approveCount})`}
                            key="approve"
                        >
                            <List
                                className={style.wnlist}
                                itemLayout="horizontal"
                                dataSource={approveData.filter((item, index) => index < 4)}
                                renderItem={item => (
                                    <List.Item key={item.title}>
                                        {/* 待我审批 */}
                                        <List.Item.Meta
                                            className={style.workListMeta}
                                            title={
                                                // <a
                                                //     href={`/personal/flow/mine/waitApproval/approvalDetail?applicationNo=${item.applicationNo}`}
                                                // >
                                                //     {item.applicationName}
                                                // </a>
                                                <LinkTo
                                                    to="/personal/portal/flow/mine/approvalDetail"
                                                    query={{
                                                        applicationNo: item.applicationNo
                                                    }}
                                                >
                                                    {item.applicationName}
                                                </LinkTo>
                                            }
                                        />
                                        <div className={style.wnlist_time}>{item.startTime}</div>
                                    </List.Item>
                                )}
                            />
                        </TabPane>
                    )}
                    {checkCode(this.authCode('done')) && (
                        <TabPane
                            tab={`${formatMessage({
                                id: 'list.pass.title'
                            })} (${passDataCount})`}
                            key="pass"
                        >
                            {/* 经我审批 */}
                            <List
                                className={style.wnlist}
                                itemLayout="horizontal"
                                dataSource={passData.filter((item, index) => index < 4)}
                                renderItem={item => (
                                    <List.Item key={item.companyId}>
                                        <List.Item.Meta
                                            className={style.workListMeta}
                                            title={
                                                // <a
                                                //     href={`/personal/flow/mine/myAudited/myAuditedDetail?applicationNo=${item.applicationNo}&linkFrom=1`}
                                                // >
                                                //     {item.applicationName}
                                                // </a>
                                                <LinkTo
                                                    to="/personal/portal/flow/mine/approvalDetail"
                                                    query={{
                                                        applicationNo: item.applicationNo
                                                    }}
                                                >
                                                    {item.applicationName}
                                                </LinkTo>
                                            }
                                        />
                                        <div className={style.wnlist_time}>{item.startingTime}</div>
                                    </List.Item>
                                )}
                            />
                        </TabPane>
                    )}
                    {checkCode(this.authCode('over')) && (
                        <TabPane
                            tab={`${formatMessage({
                                id: 'list.read.title'
                            })} (${readDataCount})`}
                            key="read"
                        >
                            {/* 待我阅读 */}
                            <List
                                className={style.wnlist}
                                itemLayout="horizontal"
                                dataSource={readData.filter((item, index) => index < 4)}
                                renderItem={item => (
                                    <List.Item key={item.id}>
                                        <List.Item.Meta
                                            className={style.workListMeta}
                                            title={
                                                // <a
                                                //     href={`/personal/flow/mine/myAuditRead/myAuditReadDetail?applicationNo=${item.applicationNo}&linkFrom=1`}
                                                // >
                                                //     {item.applicationName}
                                                // </a>
                                                <LinkTo
                                                    to="/personal/portal/flow/mine/approvalDetail"
                                                    query={{
                                                        applicationNo: item.applicationNo
                                                    }}
                                                >
                                                    {item.applicationName}
                                                </LinkTo>
                                            }
                                        />
                                        <div className={style.wnlist_time}>{item.startingTime}</div>
                                    </List.Item>
                                )}
                            />
                        </TabPane>
                    )}
                    {/* <TabPane
                        tab={formatMessage({
                            id: 'list.duban.title'
                        })}
                        key="state4"
                    >
                        <List
                            className={style.wnlist}
                            itemLayout="horizontal"
                            dataSource={mockData.filter(
                                (item, index) => index < 4
                            )}
                            renderItem={item => (
                                <List.Item key={item.recvCompany}>
                                    <List.Item.Meta
                                        className={style.workListMeta}
                                        title={<a href="#">{item.title}</a>}
                                    />
                                    <div className={style.wnlist_editor}>
                                        {item.updateUser}
                                    </div>
                                    <div className={style.wnlist_time}>
                                        {item.modifyTime}
                                    </div>
                                </List.Item>
                            )}
                        />
                    </TabPane> */}
                </Tabs>
                {passDataCount > 3 && getPath(this.state, 'goMore') === 2 ? (
                    // <a
                    //     className={style.wnlist_more}
                    //     onClick={() =>
                    //         history.push('/personal/flow/mine/myAudited')
                    //     }
                    // >
                    //     {formatMessage({
                    //         id: 'list.btn.more'
                    //     })}{' '}
                    //     <Icon type="right" />
                    // </a>
                    <LinkTo className={style.wnlist_more} to="/personal/portal/flow/mine/myAudited">
                        {formatMessage({
                            id: 'list.btn.more'
                        })}{' '}
                        <Icon type="right" />
                    </LinkTo>
                ) : null}
                {readDataCount > 3 && getPath(this.state, 'goMore') === 3 ? (
                    // <a
                    //     className={style.wnlist_more}
                    //     onClick={() =>
                    //         history.push('/personal/flow/mine/myAuditRead')
                    //     }
                    // >
                    //     {formatMessage({
                    //         id: 'list.btn.more'
                    //     })}{' '}
                    //     <Icon type="right" />
                    // </a>
                    <LinkTo className={style.wnlist_more} to="/personal/portal/flow/mine/myAuditRead">
                        {formatMessage({
                            id: 'list.btn.more'
                        })}{' '}
                        <Icon type="right" />
                    </LinkTo>
                ) : null}
            </div>
        );
    }
}
export default connect(({ gateway }) => ({
    gateway
}))(WorkList);
